<?php
$this->title = Yii::t('app', 'Jcrop');
$this->params['breadcrumbs'][] = ['label' => Yii::t('app', 'samples'), 'url' => ['index']];
$this->params['breadcrumbs'][] = $this->title;
?>
<!--BEGIN HEADER-->
<div class="section-header">
    <h3 class="text-standard"><i class="fa fa-fw fa-arrow-circle-right text-gray-light"></i> <?=$this->title?> <small><?=$this->subTitle?></small></h3>
</div>
<!--END HEADER-->
<!--BEGIN BODY-->
<div class="section-body">
    <?=\eric\widgets\jcrop\NewJcrop::widget([
        'id' => 'exsample',
        'src' => "http://frame.stargather.cn//uploads//images//20150528//7a0222f9a7571d070f470b57c7c1c122.jpg",
        'clientOptions' => [
            'boxWidth' => 350,
            'boxHeight' => 350,
            'onDblClick' => new \yii\web\JsExpression('function(){var api=this;var data=api.tellSelect();data["url"]="http://frame.stargather.cn//uploads//images//20150528//7a0222f9a7571d070f470b57c7c1c122.jpg";data["target_format"]="size_"+data.w+"_"+data.h;jcropUpload($("#exsample_jcrop"), api, data);}')
        ],
        'clientEvents' => [
            'jcropdone' => 'function(e, api, data){api.setImage(data)}'
        ],
        'mainLayout' => '{jcrop}',
        'jcropLayout' => '{image}',
    ])?>
    <?php \eric\widgets\Box::begin()?>
    <?=\eric\widgets\jcrop\NewJcrop::widget([
        'id' => 'exsample2',
        'enableFileUpload' => true,
        'ratioButtons' => [
            [
                'width' => 300,
                'height' => 300,
                'type' => 'size',
            ],
            [
                'width' => 16,
                'height' => 9,
            ]
        ],
        'clientOptions' => [
            'boxWidth' => 350,
            'boxHeight' => 350
        ],
        'clientEvents' => [
            'jcropdone' => 'function(e, api, data){api.setImage(data)}'
        ],
        'mainLayout' => '{jcrop}{fileuploader}',
        'jcropLayout' => '<div class="pull-left">{image}</div><div class="pull-left">{toolbar}</div>',
    ])?>
    <?php \eric\widgets\Box::end()?>
</div>
<!--END BODY-->